<template>
	<view class="article">
        <view class="article-content">
                <u-parse :content="content" ></u-parse>
        </view>
	</view>
</template>

<script>
	const pageDb=uniCloud.importObject('mydb-page')
	export default {
		// #ifdef APP-PLUS
		components:{
			"uni-nav-bar":uniNavBar
		},
		
		// #endif
		data() {
			return {
				// 当前显示 _id
				id: "",
				title: 'title',
				content: ''
			}
		},
		computed: {
			
		},
		onLoad(event) {
			//获取真实新闻id，通常 id 来自上一个页面
			if (event.id) {
				this.id = event.id
			}
			if (event.title) {
                this.title = event.title
            }
            pageDb.getNetDetail({netId:this.id}).then(res=>{
                if(res.status){
                    this.content = res.data.content
                }
            })
		},
		methods: {
			/**
			 * preview
			 * 内容点击
			 */
			preview(e) {
				console.log(e.detail.node)
				if(e.detail.node=='img'){
					console.log(e.detail.attrs.src)
				}
			}
		}
	}
</script>

<style scoped>
	.header-content {
		flex: 1;
		display: flex;
		flex-direction: column;
		font-size: 14px;
	}

	/* 标题 */
	.uni-title {
		display: flex;
		margin-bottom: 5px;
		font-size: 14px;
		font-weight: bold;
		color: #3b4144;
	}

	/* 描述 额外文本 */
	.uni-note {
		color: #999;
		font-size: 12px;

		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
	}

	.footer {
		display: flex;
		align-items: center;
	}

	.footer-button {
		display: flex;
		align-items: center;
		font-size: 12px;
		height: 30px;
		color: #fff;
		background-color: #ff5a5f;
	}

	.banner {
		position: relative;
		margin: 0 15px;
		height: 180px;
		overflow: hidden;
	}

	.banner-img {
		position: absolute;
		width: 100%;
	}

	.banner-title {
		display: flex;
		align-items: center;
		position: absolute;
		padding: 0 15px;
		width: 100%;
		bottom: 0;
		height: 30px;
		font-size: 14px;
		color: #fff;
		background: rgba(0, 0, 0, 0.4);
		overflow: hidden;
		box-sizing: border-box;
	}

	.uni-ellipsis {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.article-title {
		padding: 20px 15px;
		padding-bottom: 0;
	}

	.article-content {
		padding: 15px;
		font-size: 15px;
		overflow: hidden;
	}
	img{
		width: 100%;
		height: auto;
	}
</style>
